<template>
  <div class="newsinfo-container">
      <!-- 新闻头部 -->
      <h3 class="title">新闻标题</h3>
      <p class="subtitle">
          <span>发表时间</span>
          <span>点击:0次</span>
      </p>
      <hr>
      <!-- 新闻内容 -->
      <div v-html="newInfo.content"></div>
      <hr>
      <!-- 评论区域 -->
        <comment></comment>
  </div>
</template>

<script>
import urlPath from '../../config/api.js';
import {Toast} from 'mint-ui';
export default {
    name: 'newsInfo',
    data(){
        return {
            newId: this.$route.params.id,
            newInfo: ''
        };
    },
    mounted(){
        this.getNewInfo();
    },
    methods:{
        getNewInfo(){
            this.axios.get(urlPath.newInfo.getNewInfo)
            .then((res) =>{
                this.newInfo = res.data.result[0];
            })
            .catch((err) =>{
                Toast({
                    message: '加载数据出错',
                    position: 'middle',
                    duration: 3000
                });
            })
        }
    }
}
</script>

<style lang="less" scoped>
.newsinfo-container{
    padding: 0 4px 50px 4px;
    .title{
        font-size: 18px;
        text-align: center;
        margin: 10px 0;
        color: red;
    }
    .subtitle{
        font-size: 14px;
        color: #31a4fc;
        display: flex;
        justify-content: space-between;
    }
}
</style>>